import React, {createContext, ReactNode} from 'react';
import AppProvider from './AppContext';
import ModalProvider from './ModalContext';
import UserProvider from './UserContext';

type Props = {
  children: ReactNode;
};

const Providers = [AppProvider,UserProvider,ModalProvider];

const IndexContext = createContext<any>({});

const state = {};

const CombinedProviders = function ({children}: Props): JSX.Element {
  return (
    <IndexContext.Provider value={state}>
     {Providers.reduceRight(
        (acc, Provider) => <Provider>{acc}</Provider>,
        children
      )}
    </IndexContext.Provider>
  );
};

export default CombinedProviders;
